<template>
    <el-popover
        placement="right"
        width="100"
        trigger="manual"
        popper-class="right-menu"
        v-model="visible">
        <ul>
            <li @click.prevent.stop="handleClick('remove')">
                <i class="el-icon-close"></i>
                删除
            </li>
            <li @click.prevent.stop="handleClick('copy')">
                <i class="el-icon-document-copy"></i>
                复制
            </li>
            <li @click.prevent.stop="handleClick('first')">
                <i class="el-icon-arrow-up"></i>
                置顶
            </li>
            <li @click.prevent.stop="handleClick('last')">
                <i class="el-icon-arrow-down"></i>
                置底
            </li>
            <template v-if="com">
                <li @click.prevent.stop="handleClick('group')" v-if="com.objType !==3" title="按住CTRL键可多选">
                    <i class="el-icon-paperclip"></i>
                    组合
                </li>
                <li @click.prevent.stop="handleClick('groupCancel')" v-else>
                    <i class="el-icon-paperclip"></i>
                    解散
                </li>
            </template>
        </ul>
    </el-popover>
</template>

<script>
    export default {
        name: "RightKeyMenu",
        props: {
            visible: false,
            com:{}
        },
        methods: {
            handleClick(type) {
                this.$emit('onClick', type)
            },
            updateLocation(x,y) {
                document.querySelector('.right-menu').style.left =x + 'px'
                document.querySelector('.right-menu').style.top = y + 'px'
            }
        }
    }
</script>

<style scoped lang="stylus">
    /deep/ .el-popover.right-menu {
        background #393939 !important
        transition all 0.3s

        ul {
            color white
            margin -12px

            li {
                padding 8px
                cursor pointer
                font-size 12px

                &:hover {
                    background-color #545454
                }
            }
        }
    }
</style>
